<template>
	<!-- 忘记密码 -->
	<view class="warp">
		<!-- #ifdef APP-PLUS -->
		<view class="title-contents"><view class="top-view status"></view></view>
		<!-- #endif -->
		
		<view class="login-phone form-wapper">
			<view class="phone input-wapper">
				<view class="lside"><text class="iconfont icon-shouji"></text></view>
				<view class="mobile rside"><input placeholder-class="input-placeholder"  type="number" placeholder="请输入手机号" v-model="username"/></view>
			</view>
			<view class="phone input-wapper">
				<view class="lside"><text class="iconfont icon-yanzhengma"></text></view>
				<view class="mobile rside"><input placeholder-class="input-placeholder" type="number"  placeholder="请输入验证码" v-model="vercode"/></view>

				<view>
					<button type="default" @click="sendSms">{{code_text}}</button>
				</view>
			</view>
			<view class="code input-wapper">
				<view class="lside"><text class="iconfont icon-mima2"></text></view>
				<view class="rside"><input placeholder-class="input-placeholder" type="password" maxlength="12"  placeholder="请设置新密码(6-12位)" v-model="password"/></view>
			</view>
		</view>

		<button type="primary" class="login-btn" @click="forget_password">确定</button>
	</view>
</template>
<script>
	export default{
		data(){
			return{
				username:"",
				vercode:"",
				password:"",
				codeButDisabled: false,
				code_text: '发送验证码',
				host: 'https://4de16698-d9f4-443a-b416-ef1037cce952.bspapp.com/http'
			}
		},
		methods:{
			// 发送验证码
			sendSms(){
				uni.request({
					url: this.host + '/user/sendSms',
					method:'POST',
					data:{
						mobile:this.username,
						type:'login'
					},
					success: res => {
						console.log(res);
						if (res.data.code == 0) {
							// 发送成功
							// console.log(`短信已经发送到手机号${this.username},请注意查收`);
							uni.$u.toast(res.data.msg)
							// 倒计时
							let count =10;
							let timer=setInterval(()=>{
								count--
								this.code_text=`${count}s后再次获取`;
								if(count<=0){
									// 倒计时结束 清除计时器  让按钮恢复成可点击的状态
									clearInterval(timer);
									this.code_text="再次发送"
									this.codeButDisabled=false;
									count=10
								}
							},1000)
							// this.code_text="再次发送";
						} else{
							uni.$u.toast(res.data.msg)
							console.log('失败');
							this.codeButDisabled=false;
							this.code_text="再次发送";
						}
					},
					fail: () => {
						console.log('sendSms失败');
					}
				});
			},
			// 忘记密码
			forget_password() {
				if (this.username == '') {
					uni.$u.toast('请输入手机号')
					return false;
				}
				let reg =/^1[3-9]\d{9}$/;
				if (!reg.test(this.username)) {
					uni.$u.toast('手机号格式不正确')
					return false;
				}
				if (this.vercode == '') {
					uni.$u.toast('请获取验证码')
					return false;
				}
				let regcode =/^\d{6}$/;
				if (!regcode.test(this.vercode)) {
					uni.$u.toast('验证码格式不正确')
					return false;
				}
				uni.request({
					url: this.host + '/user/forget',
					method:'POST',
					data:{
						username:this.username,
						password:this.password,
						vercode:this.vercode
					},
					success: res => {
						console.log(res);
						uni.$u.toast('设置成功')
						setTimeout(function(){
							uni.navigateTo({
								url:'/pages/public/login'
							})
						},500)
					},
					fail: () => {
						console.log('出错了');
					}
				});
			}
		}
	}
</script>
<style lang="scss">
@import  "login.scss"
</style>
